<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="d1">这是div</div>
<h2 class="c1">这是h2</h2>
<p class="c1">这是p</p>
<span class="c1">这是span</span>
<input type="button" value="获取" onclick="fn1()">
<input type="button" value="修改" onclick="fn2()">
<input type="button" value="获取多个" onclick="fn3()">
<script>
    function fn1() {
        //得到div对象
        let d=document.getElementById("d1");
        //弹出div里面的文本
        alert(d.innerText);

    }
    function fn2() {
        let d=document.getElementById("d1");
        d.innerText="内容被改了";
    }
    //通过class属性获取多个元素对象 返回值是数组
    function fn3() {
        let arr=document.getElementsByClassName("c1");
        for (let i = 0; i <arr.length ; i++) {
            let o =arr[i];
            o.innerText="我是c1";
        }
    }
</script>
</body>
</html>